<%@ page pageEncoding="UTF-8" contentType="text/html;charset=utf-8" import="java.util.*,java.text.*" %>

<%

               response.setHeader("Content-Type","text/html");

               response.setHeader("charset", "utf-8");

%>
<!DOCTYPE html>
<html>
<head>
<title>月球数据下载服务</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="月球数据下载服务">

<!-- Le styles -->
<link href="./bootstrap/css/bootstrap.css" rel="stylesheet"/>
<link href="./bootstrap/css/bootstrap-modal.css" rel="stylesheet"/>
<link href="./css/footable.core.css" rel="stylesheet" type="text/css" />
<link href="./css/footable.metro.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
	padding-top: 60px;
	padding-bottom: 40px;
}

.sidebar-nav {
	padding: 19px;
}

@media ( max-width : 980px) { /* Enable use of floated navbar text */
	.navbar-text.pull-right {
		float: none;
		padding-left: 5px;
		padding-right: 5px;
	}
}


.loginBox{width:420px;height:230px;padding:0 20px;border:1px solid #fff; color:#000; margin-top:40px; border-radius:8px;background: white;box-shadow:0 0 15px #222; background: -moz-linear-gradient(top, #fff, #efefef 8%);background: -webkit-gradient(linear, 0 0, 0 100%, from(#f6f6f6), to(#f4f4f4));font:11px/1.5em 'Microsoft YaHei' ;position: absolute;left:50%;top:50%;margin-left:-210px;margin-top:-115px;}
      .loginBox h2{height:45px;font-size:20px;font-weight:normal;}
      .loginBox .left{border-right:1px solid #ccc;height:100%;padding-right: 20px; }



.map {
	height: 100%;
	width: 100%;
}
</style>
<link rel="stylesheet" href="./openlayers2/theme/default/style.css" type="text/css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-responsive.css" type="text/css">

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="../assets/js/html5shiv.js"></script>
    <![endif]-->
<body screen_capture_injected="true" youdao="bind" ryt11843="1">

	<div class="navbar navbar-inverse navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container-fluid" style="background-color:rgb(24, 33, 63)">
				<button type="button" class="btn btn-navbar collapsed"
					data-toggle="collapse" data-target=".nav-collapse">
					<span class="icon-bar"></span> <span class="icon-bar"></span> <span
						class="icon-bar"></span>
				</button>
				<a class="brand" href="#">月球数据下载服务</a>
				<div class="nav-collapse collapse" style="height: 0px;">
					<p class="navbar-text pull-right">
						<span id="loginedname" style="padding-right:5px">游客</span>
						</span><a id="alogin"  href="javascript:void(0)" class="navbar-link">登录</a></span>
					</p>
					<ul class="nav">
						<li class="active"><a href="#">主页</a>
						</li>
						<li><a href="#about">关于</a>
						</li>
						<li><a href="#contact">联系我们</a>
						</li>
					</ul>
				</div>
				<!--/.nav-collapse -->
			</div>
		</div>
	</div>

	<div class="container-fluid">
		<div class="row-fluid">
			<div class="span3" id="">
				<div id="tablecontainer" style="display:none">
					<div id="tableresult">
						<h2>查询列表</h2>
						<table class="footable">
							<thead>
								<tr>
									<th>序号</th>
									<th>名称</th>
									<th>类型</th>
									<th>大小</th>
									<th>下载</th>
								</tr>
							</thead>
							<tbody id="tbodyid">
								<tr>
									<td>Bob Builder</td>
									<td>555-12345</td>
									<td>bob@home.com</td>
									<td>bob@home.com</td>
								</tr>
							</tbody>
						</table>
						<div style="float:right">
							<button type="button" id="btnback" class="btn btn-default">返回</button>
						</div>
					</div>

				</div>

				<div id="selectioncontainer" class="well sidebar-nav">
					<div id="selectioninner">
						<h4>选择一种数据类型</h4>
						<select id="seletionid">
							
							<option value="1">嫦娥一号CCD03级</option>
							<option value="2">嫦娥二号CCD03</option>
							<option value="3">嫦娥一号激光高度计</option>
							<option value="4">LROC</option>
							<option value="5">LOLA</option>
						</select>
						<h5>输入查询的框点位</h5>
						或<button id="btnselectrectang" type="button" class="btn btn-info">框选</button>
						<button id="btnclear" type="button" class="btn btn-info">清除选择</button>
						<div class="panel panel-primary" style="background-color: #dff0d8">
							<form>
								<div class="col">
									<h5>最小X坐标</h5>
										<input id="inputxmind" type="text" style="width:40px" placeholder="度"/>度 
										<input id="inputxminf" type="text" style="width:40px" placeholder="分"/>分 
										<input id="inputxminm" type="text" style="width:40px" placeholder="秒"/>秒
								</div>
								<div class="col">
									<h5>最大X坐标</h5>
									<input id="inputxmaxd" type="text" style="width:40px" placeholder="度"/>度 
									<input id="inputxmaxf" type="text" style="width:40px" placeholder="分"/>分 
									<input id="inputxmaxm" type="text" style="width:40px" placeholder="秒"/>秒
								</div>
								<div class="col">
									<h5>最小Y坐标</h5>
									<input id="inputymind" type="text" style="width:40px"
										placeholder="度">度 <input id="inputyminf" type="text"
										style="width:40px" placeholder="分">分 <input
										id="inputyminm" type="text" style="width:40px" placeholder="秒">秒
								</div>
								<div class="col">
									<h5>最大Y坐标</h5>
									<input id="inputymaxd" type="text" style="width:40px"
										placeholder="度">度 <input id="inputymaxf" type="text"
										style="width:40px" placeholder="分">分 <input
										id="inputymaxm" type="text" style="width:40px" placeholder="秒">秒
								</div>
								<div style="margin-left:106px">
									<button type="reset" class="btn btn-default">重置</button>
									<button id="btnsearch" type="button" class="btn btn-primary">查询</button>
								</div>
							</form>
						</div>

					</div>
					<!--/.well -->
				</div>
			</div>
			<!--/span-->
			<div class="span9">
				<div class="row-fluid">
					<div class="row" style="width:101%;height:800px">
						<div id="map" class="map"></div>
					</div>
				</div>
				<!--/span-->
			</div>
			<!--/row-->

			<hr>

			<footer>
				<div style="background:red"></div>
				<p>Company 2013</p>
			</footer>

		</div>
		<!-- 登录modal -->

			<div class="modal fade" id="loginmodal" tabindex="-1000" role="dialog" 
			   aria-labelledby="myModalLabel" aria-hidden="true">
			   <div class="modal-dialog">
			      <div class="modal-content">
			      	<div class="modal-header">
			            <button type="button" class="close" 
			               data-dismiss="modal" aria-hidden="true">
			                 		 关闭
			            </button>
			         </div>
			         <div class="modal-body" style="width: 430px;height: 350px;overflow:hidden ">

					   <div style="left:25%;top:5%;position: absolute;">
					   		<div id="loginsection">
					   			 <h2>用户登录</h2>
						            <p>用户名<input type="text" id="username" /></p>
						            <p>密&nbsp;&nbsp;&nbsp;码<input type="password" id="password" /></p>
									
						          <label><input type="checkbox" name="rememberme" />下次自动登录</label>
						          <input type="button" id="btnlogin"  value="登录 " class="btn btn-primary"/>
								   <h2>没有帐户？</h2>
				              	   <p>介绍项目情况。。。</p>
							</div>
					   		<div id="registsection" style="display:none;margin-bottom:6px;">
					   			 <h2>用户注册</h2>
						            <p>用户名<input type="text" id="regusername" /></p>
						            <p>密&nbsp;&nbsp;&nbsp;码<input type="password" id="regpassword" /></p>
									<p>重复密码<input type="password" id="regrepassword" /></p>
						          <input type="button" value="注册" id="btnregist" class="btn btn-primary"/>
						         
							</div>
				           		
				              <p><input  type="button" id="btnpreregist" style="float:right" value="注册" class="btn"/></p>
					   
					   </div>         
			         </div>
			      </div>
				</div>
			</div>

			
			
			
	</div>
	
	
		<!--[if IE]>
			<script src="js/respond.js"></script>
		<![endif]-->
		<script src="jquery.js" type="text/javascript"></script>
		<script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
		<script type="text/javascript" src="bootstrap/bootstrap-modal.js"></script>
		<script type="text/javascript" src="js/jquery.cokie.min.js"></script>
		<script src="./js/footable.js" type="text/javascript"></script>
		<script src="./js/OpenLayers2.js" type="text/javascript"></script>
		<script type="text/javascript" src="js/user.js"></script>
		<script type="text/javascript" src="js/index.js"></script>
		<script>
			var map;
			var layer;
			var wmslayer;
			var drawControls;
			var featureLayer;
			var boxLayer;
			var featuremarkers;
			var selectedpolygon;
			//var mapBaseURL = "http://159.226.88.92:8399/arcgis/rest/services/moonGrayBase/MapServer/export";//当前地图底图资源
			var tabletemplate = $("#tablecontainer").html();
			var selectioncontainer = $("#selectioncontainer").html();
			$("#tableresult").remove();
			$(document).ready(function() {
				$("#loginmodalcontainer").hide();
				init();					
				$("#btnselectrectang").click(function() {
					selectRec();
				});
				$("#btnclear").click(function(){
					boxLayer.removeAllFeatures();
					featureLayer.removeAllFeatures();
				});
				$("#btnsearch").click(function() {
							var seltype = $("#seletionid option:selected").attr("value");
							search(seltype);

						});
			});


		</script>
</body>
</html>